﻿<UserControl x:Class="navigation.Controls.FlipStoryCard"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:ed="http://schemas.microsoft.com/expression/2010/drawing"
	         xmlns:Custom="http://schemas.microsoft.com/surface/2008"
             xmlns:control="clr-namespace:navigation.Controls"
	         xmlns:thriple="http://thriple.codeplex.com/"
             mc:Ignorable="d" 
             x:Name="FlipSC"
             d:DesignHeight="300" d:DesignWidth="400">    
    <UserControl.Resources>

        <Style x:Key="SurfaceButtonStyle1" TargetType="{x:Type Custom:SurfaceButton}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Custom:SurfaceButton}">
                        <Grid x:Name="gdFrontsideKnob" Background="White" Cursor="Hand" Clip="M39.5,20 C39.5,30.769552 30.769552,39.5 20,39.5 C9.2304478,39.5 0.5,30.769552 0.5,20 C0.5,9.2304478 9.2304478,0.5 20,0.5 C30.769552,0.5 39.5,9.2304478 39.5,20 z">
                            <ed:Arc ArcThickness="4" ArcThicknessUnit="Pixel" EndAngle="360" Fill="Black" Stretch="None" Stroke="Black" StartAngle="0" UseLayoutRounding="False"/>
                            <ed:BlockArrow Fill="Black" Height="14" Orientation="Left" Stroke="Black" UseLayoutRounding="False" VerticalAlignment="Center" HorizontalAlignment="Center" Width="20"/>
                            <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Content=""/>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <Storyboard x:Key="TurnToBackSide"/>

    </UserControl.Resources>

    
        <thriple:ContentControl3D Width="400" Height="300" Name="FlipCard" RenderTransformOrigin="0.5,0.5" EasingMode="Pounce" RotationDirection="RightToLeft">
            <thriple:ContentControl3D.RenderTransform>
                <TransformGroup>
                    <ScaleTransform ScaleY="1.1" ScaleX="1.45"/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </thriple:ContentControl3D.RenderTransform>
            <thriple:ContentControl3D.Content>
                <Grid x:Name="FrontSide" Width="{Binding Path=ActualWidth, ElementName=FlipCard}" Height="{Binding Path=ActualHeight, ElementName=FlipCard}">
                    <Border BorderBrush="Black" BorderThickness="4" CornerRadius="8">
                        <Border.Background>
                            <SolidColorBrush Color="white" Opacity="0.9"/>
                        </Border.Background>
                        <Grid Margin="4">
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <Canvas Grid.RowSpan="2" Grid.ColumnSpan="2" Margin="58,2,2,2">
                                <TextBlock Canvas.Left="40" TextWrapping="Wrap" Text="{Binding ElementName=FlipSC, Path=StoryName}" Canvas.Top="35" Foreground="Black" TextAlignment="Center" FontSize="32"/>
                                <TextBlock TextWrapping="Wrap" Text="{Binding ElementName=FlipSC, Path=StoryContent}" Height="98.96" Canvas.Left="30" Canvas.Top="110" Width="270" Foreground="Black" FontSize="20"/>
                                <TextBlock Canvas.Left="160" TextWrapping="Wrap" Text="Story Points:" Canvas.Top="220"  Foreground="Black" FontSize="20"/>
                                <TextBlock Canvas.Left="280" TextWrapping="Wrap" Text="{Binding ElementName=FlipSC, Path=StoryPoints}" Canvas.Top="220" Foreground="Black" FontSize="20"/>
                            </Canvas>
                            <Custom:SurfaceButton HorizontalAlignment="Left" Height="40" Margin="8,0,0,0" Grid.RowSpan="2" Style="{DynamicResource SurfaceButtonStyle1}" VerticalAlignment="Center" Width="40" Command="thriple:ContentControl3D.RotateCommand"/>
                        </Grid>
                    </Border>
                </Grid>
            </thriple:ContentControl3D.Content>

            <thriple:ContentControl3D.BackContent>
                <Grid x:Name="BackSide" Width="{Binding Path=ActualWidth, ElementName=FlipCard}" Height="{Binding Path=ActualHeight, ElementName=FlipCard}">
                    <Border Background="white" BorderBrush="#FF5E5E5E" BorderThickness="4" CornerRadius="8">
                        <Grid Margin="4">
                            <Grid.RowDefinitions>
                                <RowDefinition/>
                                <RowDefinition/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                            <Canvas Grid.RowSpan="2" Grid.ColumnSpan="2" Margin="58,2,2,2">
                                <control:TaskListControl TaskList="{Binding TaskList}" UserStory="{Binding}" Margin="5" Width="290" Height="190" HorizontalAlignment="Stretch"/>
                            </Canvas>
                            <Custom:SurfaceButton HorizontalAlignment="Left" Height="40" Margin="8,0,0,0" Grid.RowSpan="2" Style="{DynamicResource SurfaceButtonStyle1}" VerticalAlignment="Center" Width="40" Command="thriple:ContentControl3D.RotateCommand"/>
                        </Grid>
                    </Border>
                </Grid>
            </thriple:ContentControl3D.BackContent>
        </thriple:ContentControl3D>
   
</UserControl>
